<!doctype html>
<html>

<head>
<title>Unit Tests</title>

<script src="/node_modules/qunit/qunit/qunit.js"></script>
<link rel="stylesheet" href="/node_modules/qunit/qunit/qunit.css"/>

<script src="/node_modules/source-map-support/browser-source-map-support.js"></script>
<script>sourceMapSupport.install();</script>

<script>
const isNode = () => false;
</script>

<script src="/testem.js"></script>
{{#serve_files}}<script src="{{{src}}}"{{#attrs}} {{&.}}{{/attrs}}></script>{{/serve_files}}

<script>
QUnit.config.reorder = false;
QUnit.config.noglobals = true;
QUnit.config.hidepassed = true;
QUnit.config.testTimeout = 15000;
</script>

{{#visual}}
<script>
QUnit.testDone(visualCallback.testDone.bind(visualCallback));

// global error handling
window.addEventListener('unhandledrejection', (event) => {
  // prevent logging to console
  event.preventDefault();
  QUnit.onUncaughtException(event.reason);
});

window.addEventListener('error', (event) => {
  // prevent logging to console
  event.preventDefault();
  QUnit.onUncaughtException(event.error);
});

function downloadGoldens() {
    const checkbox = document.getElementById('qunit-urlconfig-hidepassed');
    checkbox.checked && checkbox.click();
    document.querySelectorAll('[data-canvas-type="actual"] > canvas').forEach(canvas => {
        const link = document.createElement('a');
        link.href = fabric.util.toDataURL(canvas, 'png', 1);
        link.download = canvas.getAttribute('data-golden');
        link.click();
    });
}

//  https://stackoverflow.com/questions/4565112/javascript-how-to-find-out-if-the-user-browser-is-chrome/13348618#13348618
var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edg") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");
if(
  isIOSChrome || 
  (isChromium !== null &&
  //typeof isChromium !== "undefined" &&    //  fails on headless chrome
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false)
) {
   // is Google Chrome
    QUnit.recreateVisualRefs = {{qunit.recreate}};
    QUnit.debugVisual = {{qunit.debug}};
    {{#qunit.filter}}QUnit.config.filter = {{qunit.filter}};{{/qunit.filter}}
}
</script>
{{/visual}}

{{#styles}}<link rel="stylesheet" href="{{.}}">{{/styles}}

</head>

<body>

<div id="qunit"></div>
<div id="qunit-fixture"></div>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>

<canvas id="canvas" width="500" height="500"></canvas>
<canvas id="static-canvas" width="500" height="500"></canvas>

<template id="error_output">
    <table>
        <thead>
            <row>
                <th class="text-center">expected</th>
                <th class="text-center">actual</th>
                <th class="text-center">diff</th>
            </row>
        </thead>
        <tbody>
            <row>
                <td data-canvas-type="expected"></td>
                <td data-canvas-type="actual"></td>
                <td data-canvas-type="diff"></td>
            </row>
        </tbody>
    </table>
</template>

{{#visual}}
<footer>
    <button onclick="downloadGoldens()" class="tr-button">Download Goldens</button>
</footer>
{{/visual}}

</body>
</html>
